<template>
	<view class="settleSecord-wrap">
		<scroll-view show-scrollbar="false" class="settleSecord-list" scroll-y @scrolltolower="scrollLoading()">
			<u-doctor-inquiry-order v-for="(item, index) in dataList" :key="index" :data="item"></u-doctor-inquiry-order>

			<u-empty-state v-if="dataTotalPage == 0" value="暂无相关问诊订单"></u-empty-state>
			<uni-load-more v-if="dataTotalPage > 1" :status="dataLoading"></uni-load-more>
		</scroll-view>
	</view>
</template>

<script>
import uDoctorInquiryOrder from '../components/u-doctor-inquiry-order/u-doctor-inquiry-order.vue';
import uniLoadMore from '@/components/uni/uni-load-more/uni-load-more.vue';
import uEmptyState from '@/components/u-empty-state/u-empty-state.vue';
export default {
	components: {
		uDoctorInquiryOrder,
		uniLoadMore,
		uEmptyState
	},
	data() {
		return {
			pageNo: 1,
			pageSize: 20,
			dataTotalPage: 1, //数据总数
			dataLoading: 'loading', //数据加载
			dataList: [],
			id: null
		};
	},
	onLoad(options) {
		this.id = options.id
		this.settleCycleRecord();
	},
	onShow() {},
	methods: {
		tabChange(e) {
			this.activeTab = e;
			this.pageNo = 1;
			this.dataList = [];
			this.dataTotalPage = 1;
			this.scrollLoading();
		},
		
		//结算记录详情列表
		settleCycleRecord() {
			const params = {
				pageNo: this.pageNo,
				pageSize: this.pageSize,
				settleId:this.id
			};
			this.$api
				.settleCycleRecord({
					params: params
				})
				.then(res => {
					if (res.code == 200) {
						this.dataTotalPage = res.result.pages;
		
						if (this.pageNo == 1) {
							this.dataList = res.result.records;
						} else {
							this.dataList = this.dataList.concat(res.result.records);
						}
		
						if (res.result.current >= res.result.pages) {
							this.dataLoading = 'noMore';
						} else {
							this.dataLoading = 'loading';
						}
						this.pageNo++;
					} else {
						uni.showToast({
							title: res.message,
							icon: 'none'
						});
					}
				});
		},
		
		//滚动加载
		scrollLoading() {
			if (this.pageNo <= this.dataTotalPage) {
				this.settleCycleRecord();
			}
		}
	}
};
</script>

<style lang="less">
@import './settleSecord.less';
</style>
